Creating background matting in GIF and PNG images

When you know the Web page background color on which an image will be displayed, you can use the matting feature to fill or blend transparent pixels with a matte color that matches the Web page background.

The results of matting GIF and PNG-8 images depend on the Transparency option. If you select Transparency, only the partially transparent pixels, such as those at the edge of an anti-aliased image, are matted. When the image is placed on a Web page, the Web background shows through the transparent pixels, and the edges of the image blend with the background. This feature prevents the halo effect that results when an anti-aliased image is placed on a background color that differs from the image's original background. This feature also prevents the jagged edges that result with GIF hard-edged transparency.

If you deselect Transparency, fully transparent pixels are filled with the matte color, and partially transparent pixels are blended with the matte color.

To create a matted GIF or PNG image:

1 Open or create an image that contains transparency, and choose File > Save for Web.

2 In the Save For Web dialog box, select GIF, PNG-8, or PNG-24 as the optimization format.

3 For GIF and PNG-8 format, select or deselect the Transparency option as desired.

4 Select a color from the Matte pop-up menu: Eyedropper (to use the color in the eyedropper sample box), White, Black, or Other (to select a color using the color picker).

Optimizing Images for the Web > Making transparent and matted images > Creating background matting in GIF and PNG images